<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>支付页</title>
		<link rel="stylesheet" href="css/style.css" />
		<link rel="stylesheet" href="css/pay.css" />
		<script type="text/javascript" src="js/jquery-1.11.0.js" ></script>
		<script type="text/javascript" src="js/pay.js" ></script>
		<script type="text/javascript" src="js/style.js" ></script>
		<script type="text/javascript" src="js/shopHis.js" ></script>
	</head>

	<body>
		<!--顶部-->
		<div class="hearder">
    <div class="top">
        <div class="w12">
            <div class="top-left">
                <span>亲，欢迎来到沐鱼！</span>
                【<a href="login.html" class="active">会员登录</a>】
                【<a href="reg.html">免费注册</a>】
            </div>
            <div class="top-right">
                <a href="user.html">
                    <img src="img/index-top.png">
                    <span>个人中心</span>
                </a>
                <a href="#">
                    <img src="img/index-top2.png">
                    <span>问题帮助</span>
                </a>
                <span>全国热线：400-123123</span>
            </div>
        </div>
    </div>
    <div class="middle">
        <div class="w12">
            <div class="logo">
                <a href="index.html"><img src="img/logo.png"></a>
            </div>
            <div class="middle-right">
                <div class="search">
                    <form>
                       <input type="text" name="deta" id="search" value="">
                          <ul class="search-list">
                        	<li><a href=""><span>男士面膜</span><span>约556个商品</span></a></li>
                        	<li><a href=""><span>奥克斯</span><span>约366个商品</span></a></li>
                        	<li><a href=""><span>安踏</span><span>约776个商品</span></a></li>
                        	<li><a href=""><span>冰箱</span><span>约1012个商品</span></a></li>
                        	<li><a href=""><span>杯子</span><span>约999个商品</span></a></li>
                        	<li><a href=""><span>手机</span><span>约1600个商品</span></a></li>
                        	<li><a href=""><span>路由器</span><span>约653个商品</span></a></li>
                        </ul>
                        <input type="submit" name="submit">
                    </form>
                    <ul>
                        <li>热门搜索：</li>
                        <li><a href="#" class="active">女生挎包</a></li>
                        <li><a href="#">男士背包</a></li>
                        <li><a href="#">女生背包</a></li>
                        <li><a href="#">男士双肩背包</a></li>
                        <li><a href="#">男士登山包</a></li>
                    </ul>
                </div>
                <div class="cart">
                    <a href="shop_cart.html">
                        <img src="img/top-gouwu.png">
                        <i>0</i>
                        <span>购物车</span>
                    </a>
                     <ul class="cart-lister">
                    	<li><a href=""><img src="img/top-gouwu.png"/><span>购物车是空的，快去购买商品吧！</span></a></li>
                    </ul>
                    <ul class="cart-list-two">
                    	<li>
                    		<a href="">
                    			<img src="img/main_138.png">
                    		</a>
                    		<a href=""><h6>沐鱼美包包</h6></a>
                    		<a href="" class="topCat-price">
                    			&yen;83
                    		</a>
                    	</li>
                    </ul>
                </div>
               
            </div>
        </div>
    </div>
    <div class="nav">
        <div class="w12">
            <div class="left">
                <a href="javascript:void(0);">
                    <img src="img/nav.png">
                    商品分类
                </a>
                <ul class="list">
                    <li>
                        <h2>女包</h2>
                        <ul>
                            <li><a href="#">单肩包</a></li>
                            <li><a href="#">斜挎包</a></li>
                            <li><a href="#">双肩背包</a></li>
                            <li><a href="#">手提包</a></li>
                            <li><a href="#">手拿包</a></li>
                            <li><a href="#">钱包</a></li>
                            <li><a href="#">卡包</a></li>
                            <li><a href="#">钥匙包</a></li>
                        </ul>
                    </li>
                    <li>
                        <h2>男包</h2>
                        <ul>
                            <li><a href="#">单肩包</a></li>
                            <li><a href="#">斜挎包</a></li>
                            <li><a href="#">双肩背包</a></li>
                            <li><a href="#">手提包</a></li>
                            <li><a href="#">手拿包</a></li>
                            <li><a href="#">钱包</a></li>
                            <li><a href="#">卡包</a></li>
                            <li><a href="#">钥匙包</a></li>
                        </ul>
                    </li>
                    <li>
                        <h2>功能包</h2>
                        <ul>
                            <li><a href="#">行李包</a></li>
                            <li><a href="#">拉杆箱</a></li>
                            <li><a href="#">胸包</a></li>
                            <li><a href="#">电脑包</a></li>
                            <li><a href="#">运动包</a></li>
                            <li><a href="#">腰包</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
            <div class="right">
                <ul>
                    <li><a href="index.html">首页</a></li>
                    <li><a href="user.html">会员中心</a></li>
                    <li><a href="#">新品汇集</a></li>
                    <li><a href="#">热卖推荐</a></li>
                </ul>
            </div>
        </div>
    </div>
</div>
		<div class="main">
			<div class="w12">
				<div class="flow">
					<a href="shop_cart.html" class="shop"><span>我的购物车</span></a>
					<a href="confirm_order.html" class="ok"><span>确认订单</span></a>
					<a href="javascript:void(0);" class="pay get"><span>支付页</span></a>
				</div>
				<div class="text">
					<h4>您的订单已生成，请尽快付款！</h4>
				</div>
				<div class="pay-top">
					<p>合计<span>4</span>件商品，应付金额 <span>1600.00</span> 元</p>
					<h5>请您在提交订单后<span>72</span>小时内完成支付，否则订单将自动取消</h5>
				</div>
				<div class="text">
					<h4>选择支付方式</h4>
				</div>
				<div class="pay-way">
					<form>
						<ul>
							<li><label><input type="radio" name="pay"><i id="pay"></i><img src="img/zhifubao.png"></label></li>
							<li><label><input type="radio" name="pay"><i id="pay"></i><img src="img/yinlian.png"></label></li>
							<li><label><input type="radio" name="pay"><i id="pay"></i><img src="img/dongfang.png"></label></li>
							<li><label><input type="radio" name="pay"><i id="pay"></i><img src="img/yinlian.png"></label></li>
						</ul>
						<p>
							<span>其他付款方式</span>
							<a href="#">+银行卡</a>
						</p>
						<div class="card">
							<h6>您在安全环境中，请放心支付！</h6>
							<span>请输入您的卡号：</span><input type="text" name="card" value="" id="card"/>
							<h5><span>请输入支付密码：</span><input type="password" name="password" value="" id="password"/><a href="#">忘记密码？</a></h5>
							<input type="submit" name="submit" value="确认支付" id="submit"/>
						</div>
					</form>
				</div>
				<div class="main-foot">
					<ul>
						<li><img src="img/login-zhuan.png" /><span>100%正品保证</span></li>
						<li><img src="img/login-you.png" /><span>新人首单免邮</span></li>
						<li><img src="img/login-qi.png" /><span>七天包退换</span></li>
						<li><img src="img/login-m.png" /><span>首次退换免邮费</span></li>
					</ul>
				</div>
			</div>
		</div>
		<!--footer-->

		<div class="foot">
			<div class="w12">
				<div class="foot-left">
					<div class="foot-list">
						<h2>消费保障</h2>
						<ul>
							<li>
								<a href="#">网购警示</a>
							</li>
							<li>
								<a href="#">隐私保护</a>
							</li>
							<li>
								<a href="#">投诉中心</a>
							</li>
							<li>
								<a href="#">客服中心</a>
							</li>
						</ul>
					</div>
					<div class="foot-list">
						<h2>购物指南</h2>
						<ul>
							<li>
								<a href="reg.html">免费注册</a>
							</li>
							<li>
								<a href="#">购物流程</a>
							</li>
							<li>
								<a href="#">会员介绍</a>
							</li>
							<li>
								<a href="#">常见问题</a>
							</li>
						</ul>
					</div>
					<div class="foot-list">
						<h2>配送方式</h2>
						<ul>
							<li>
								<a href="#">收货上门</a>
							</li>
							<li>
								<a href="#">上门自提</a>
							</li>
							<li>
								<a href="#">配送查阅</a>
							</li>
							<li>
								<a href="#">海外配送</a>
							</li>
						</ul>
					</div>
					<div class="foot-list">
						<h2>支付方式</h2>
						<ul>
							<li>
								<a href="#">在线支付</a>
							</li>
							<li>
								<a href="#">货到付款</a>
							</li>
							<li>
								<a href="#">分期付款</a>
							</li>
							<li>
								<a href="#">公司转账</a>
							</li>
						</ul>
					</div>
					<div class="foot-list">
						<h2>售后服务</h2>
						<ul>
							<li>
								<a href="#">售后政策</a>
							</li>
							<li>
								<a href="#">价格保护</a>
							</li>
							<li>
								<a href="#">取消订单</a>
							</li>
							<li>
								<a href="#">退款流程</a>
							</li>
						</ul>
					</div>
				</div>
				<div class="foot-right">
					<h2>服务热线（8:00-18:00）</h2>
					<ul>
						<li>400-123123</li>
						<li>服务邮箱</li>
						<li>123456789@qq.com</li>
					</ul>
				</div>

			</div>

		</div>
		<div class="w12">
			<div class="base">
				  <ul>
            <li>
                <a href="http://www.alibabagroup.com/cn/global/home">阿里巴巴集团</a>
            </li>
            <li>
                <a href="https://www.taobao.com/">淘宝网</a>
            </li>
            <li>
                <a href="https://www.tmall.com">天猫</a>
            </li>
            <li>
                <a href="http://www.smzdm.com">聚划算</a>
            </li>
            <li>
                <a href="https://www.vip.com/">唯品会</a>
            </li>
            <li>
                <a href="http://www.alibaba.com/">阿里巴巴国际交易市场</a>
            </li>
            <li>
                <a href="https://www.1688.com/">1688</a>
            </li>
            <li>
                <a href="https://www.alimama.com">阿里妈妈</a>
            </li>
            <li>
                <a href="http://trip.taobao.com">去啊</a>
            </li>
            <li>
                <a href="https://wanwang.aliyun.com">万网</a>
            </li>
            <li>
                <a href="https://www.aliyun.com">阿里云计算</a>
            </li>
        </ul>
				<div class="copy">
					<span>&copy;2011-2017   taobao china. 雅倩版权所有   </span>
					<ul>
						<li>
							<a href="#"> 隐私权政策</a>
						</li>
						<li>
							<a href="#"> 用户服务协议</a>
						</li>
						<li>
							<a href="#"> 条约规定</a>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</body>

</html>